<template>
  <div class="box">
    <el-tabs v-model="activeName" @tab-click="handleClick">
      <el-tab-pane label="文字链接" name="first"><textLink /></el-tab-pane>
      <el-tab-pane label="图片链接" name="second"><imgLink /></el-tab-pane>
    </el-tabs>
    <el-button
      class="btn"
      type="primary"
      plain
      size="small"
      icon="el-icon-plus"
      @click="$refs.addLink.dialogShow = true"
    >新增</el-button>
    <addLink ref="addLink" />
  </div>
</template>
<script>
import textLink from './components/textLink.vue'
import imgLink from './components/imgLink.vue'
import addLink from './components/addLink.vue'
export default {
  name: 'Link',
  components: {
    textLink,
    imgLink,
    addLink
  },
  data() {
    return {
      activeName: 'second',
      dialog: false
    }
  },
  methods: {
    handleClick(tab, event) {
      console.log(tab, event)
    },
    dialogTrue() {

    }
  }
}
</script>
<style>
.box{
  position: relative;
}
.btn{
  position: absolute;
  top: 6px;
  right: 33px;
}
</style>
